//
//  Layouts.swift
//  learn-ios
//
//  Created by Dong on 2022/4/5.
//

import SwiftUI

struct Layouts: View {
    var body: some View {
        ScrollView(.vertical) {
            VStack {
                
                Group{
                    HStack {
                        Text("堆栈").font(.title)
                    }
                    List {
                        NavigationLink {
                            UseHStack()
                        } label: {
                            Text("水平堆栈")
                        }

                        NavigationLink {
                            UseVStack()
                        } label: {
                            Text("垂直堆栈")
                        }

                        NavigationLink {
                            UseZStack()
                        } label: {
                            Text("层级堆栈")
                        }
                    }
                    .frame(height: 190)
                }
                
                Group {
                    HStack {
                        Text("懒堆栈").font(.title)
                    }

                    List {
                        NavigationLink {
                            UseLazyHStack()
                        } label: {
                            Text("懒水平堆栈")
                        }

                        NavigationLink {
                            UseLazyVStack()
                        } label: {
                            Text("懒垂直堆栈")
                        }
                    }
                    .frame(height: 150)
                }

                Group{
                    HStack {
                        Text("网格").font(.title)
                    }

                    List {
                        NavigationLink {
                            UseLazyHGrid()
                        } label: {
                            Text("水平懒网格")
                        }

                        NavigationLink {
                            UseLazyVGrid()
                        } label: {
                            Text("垂直懒网格")
                        }
                    }
                    .frame(height: 200)
                }

               
                Group{
                    HStack {
                        Text("分隔符").font(.title)
                    }

                    List {
                        NavigationLink {
                            UseSpacer()
                        } label: {
                            Text("垫片")
                        }

                        NavigationLink {
                            UseDivider()
                        } label: {
                            Text("分割线")
                        }
                    }
                    .frame(height: 200)
                }
                

                HStack {
                    Text("对齐").font(.title)
                }
                
                List {
                    NavigationLink {
                        UseAlignment()
                    } label: {
                        Text("布局")
                    }

                    NavigationLink {
                        UseDivider()
                    } label: {
                        Text("水平布局")
                    }
                    
                    NavigationLink {
                        UseDivider()
                    } label: {
                        Text("垂直布局")
                    }
                }
                .frame(height: 200)
            }
        }
        .padding()
    }
}

struct Layouts_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            Layouts()
        }
    }
}
